<template>
	<view class="page">
		<wd-navbar title="修改简介" fixed placeholder left-arrow safeAreaInsetTop custom-class="nav" :bordered="false" @click-left="handleClickLeft"></wd-navbar>
		<view class="content_box">
			<wd-textarea custom-class="cus_textarea" v-model="value" :maxlength="100" clearable show-word-limit />
			<wd-button custom-class="wd_btn" @click="handleClick" :disabled="!value.length" block>保存</wd-button>
		</view>
	</view>
</template>

<script setup>
import { toRouter, showToastLoading, showToast } from "@/hooks/utils";
import { ref } from 'vue';
import store from "../../store";
const value = ref(store.state.value.userInfo?.profile || '')
const handleClickLeft = function handleClickLeft() {
  uni.navigateBack()
}
const handleClick = ()=> {
	showToastLoading()
	store.updateUserInfo({
		profile: value.value
	}).then(()=>{
		showToast('修改成功')
		setTimeout(()=>{
			handleClickLeft()
		},200)
	})
}
</script>

<style lang="scss" scoped>
:deep() {
	.nav {
		background: rgb(245, 245, 245) url("http://124.223.41.167:8080/mobile/static/images/bg.png") no-repeat top left/100% auto;
	}
	.cus_textarea {
		width: 100%;
		box-sizing: border-box;
		border-radius: 24rpx;
		box-shadow: 0 1rpx 10rpx rgba(0,0,0,.2);
		margin-bottom: 10px;
	}
	.wd_btn {
		background: #FE4484;
		margin-top: 94rpx;
		--wot-color-theme: #FE4484;
		&.is-disabled {
			--wot-color-theme: #BFBFBF;
			--wot-button-disabled-opacity: 1;
		}
	}
}
.page {
	position: relative;
	&:before {
		content: '';
		position: fixed;
		left: 0;
		top: 0;
		width: 100vw;
		height: 100vh;
		background: rgb(245, 245, 245) url("http://124.223.41.167:8080/mobile/static/images/bg.png") no-repeat top left/100%;
		z-index: -1;
	}
}
.content_box {
	padding: 40rpx;
}
</style>
